<template>
  <div class="user">
    <van-nav-bar title="我的" left-text="" right-text="" left-arrow>
      <template #left>
        <van-icon name="cross" size="19" color="#000" />
      </template>
      <!-- <template #right>
        <van-icon name="ellipsis" size="22" color="#000" />
      </template> -->
    </van-nav-bar>
    <Info />
    <div style="display: flex;margin-top: 21px;">
      <div style="width: 170px;height: 40px;margin: 0 auto;border-radius: 50px;" @click="mywarehouse">
        <van-cell title="单元格" label="" is-link >
          <template slot="title">

            <div style="display: flex;">
              <img src="@/assets/my/center1.png" alt="logo" style="width: 40px;height: 40px;left: 6px;">
              <div
                style="font-family: MiSans, MiSans;font-weight: 400;font-size: 17px;color: #000000;margin-left: 10px;">
                {{userInfo.store }}</div>
            </div>
            <div
              style="position: absolute;margin-left: 50px;margin-top: -15px;font-family: MiSans, MiSans;font-weight: 400;font-size: 12px;color: #A2A2A2;">
              我的仓库
            </div>

          </template>
        </van-cell>
      </div>
      <div style="width: 170px;height: 60px;margin: 0 auto;border-radius: 50px;" @click="myCoin">
        <van-cell title="单元格" label="" is-link>
          <template slot="title">

            <div style="display: flex;">
              <img src="@/assets/my/center2.png" alt="logo" style="width: 40px;height: 40px;left: 6px;">
              <div style="font-family: MiSans, MiSans;font-weight: 400;font-size: 17px;color: #000000;margin-left: 10px;">{{userInfo.money}}</div>

            </div>
            <div style="position: absolute;margin-left: 50px;margin-top: -15px;font-family: MiSans, MiSans;font-weight: 400;font-size: 12px;color: #A2A2A2;">
              我的余额
            </div>
          </template>
        </van-cell>
      </div>

    </div>

    <Order />
    <Tools />
    <div style="height: 30px;"></div>
  </div>
</template>

<script>
import store from '../../store'
import Info from './modules/Info'
import Order from './modules/Order'
import Tools from './modules/Tools'
import { mapGetters } from 'vuex'
export default {
  name: 'User',
  components: {
    Info,
    Order,
    Tools
  },
  computed: {
   
    ...mapGetters(['userInfo'])
  },
  mounted(){
    store.dispatch('user/getInfo')
  },
  methods: {
   
    myCoin() {
      this.$router.push({
        path: '/coin'
      })
    },
    mywarehouse(){
      this.$router.push({
        path: '/warehouse'
      })
    }
  }
}
</script>

<style>
.user-order2 {
  width: 340px;
  height: 120px;
  margin: 0 auto;
  box-shadow: var(--user-order-shadow);
  border-radius: 100px;
  margin-top: 42px;
}
</style>
